<template>
  <div>
    <h1>登录</h1>
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <a-form-model-item ref="account" label="账号" prop="account">
        <a-input v-model="form.account" />
      </a-form-model-item>
      <a-form-model-item ref="password" label="密码" prop="password">
        <a-input v-model="form.password" />
      </a-form-model-item>
      <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
        <a-button type="primary" @click="login()">
          登录
        </a-button>
      </a-form-model-item>
    </a-form-model>
  </div>
</template>

<script>
import { login } from "@/api";
export default {
  name: "login",
  data() {
    return {
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      form: {},
      rules: {}
    };
  },
  methods: {
    login() {
      login(this.form)
        .then(res => {
          this.$store.commit("LOGIN_IN", res.data.token);
          this.$router.push("/menuConfig");
        })
        .catch(err => {});
    }
  }
};
</script>

<style></style>
